<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

	<head>
		<link rel="shortcut icon" type="image/x-icon" th:href="@{/img/order.png}">
		<meta charset="UTF-8">
		<title>订单</title>



		<link rel="stylesheet" type="text/css" th:href="@{/css/style.css}" href="css/style.css" />
		<link rel="stylesheet" type="text/css" th:href="@{/css/reset.css}"  href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" th:href="@{/css/shopping-order.css}" href="css/shopping-pay.css" />
		<link rel="stylesheet" type="text/css" th:href="@{/css/head.css}" href="css/head.css" />
		<link rel="stylesheet" type="text/css" th:href="@{/css/footer.css}" href="css/footer.css"/>




	</head>

	<body>
		<div th:insert="head::topbar"></div>
		<div class="container">
			<div class="w-panel">
				<div class="title-inform">
					<span>收货信息</span>
				</div>
				<div class="bd-table">
					<div class="bd-tablef">
						<div class="bd-table-left fl">

							<div >
								<input type="hidden" id="llll" th:value="${session.indent.getIndentIdentify()}" />
								<input type="hidden" id="indentId" th:value="${session.indent.getIndentId()}" />

                                <fieldset class="fffff" style="padding:5px;margin-left: 40px;">
                                    <!--<legend>收货地址</legend>-->
                                    <span>地址：</span>
                                    <!--<select class="P1" name="P1"></色lect>-->
                                    <!--<select class="C1" name="C1"></色lect>-->
                                    <!--<select class="C2" name="C2"></色lect>-->
                                    <select class="form-control P1" style="width: 400px;height: 30px;line-height: 30px;color: #b4a078;border-radius: 5px;border: 1px solid #b4a078">
                                        <option value="0">请根据您的收货地址选择一个收货地址</option>
                                        <option class="xiala" value="010" th:each="add:${session.address}" th:value="${add.getAddressId()}" th:text="${add.getAddress()}">北京</option>
                                        </select>
                                </fieldset>

								<div class="consignee-list" style="margin-left: 40px">
									<div class="man">
										<label for="" class="consignee">收货人：</label>
                                        <p style="display: inline-block;width: 400px;height: 30px;line-height: 30px;color: #b4a078;border-radius: 5px;border: 1px solid #f5f3ef";  th:text="${session.customerIndent.getCustomerName()}">此处显示收货地址</p>
										<input type="hidden" name="" th:value="${session.customerIndent.getCustomerNickname()}" class="" placeholder="输入地址"   sucmsg='通过验证' />
									</div>
									<div class="tel">
										<label for="" class="iphone">手机号码：</label>
                                        <p style="display: inline-block;width: 400px;height: 30px;line-height: 30px;color: #b4a078;border-radius: 5px;border: 1px solid #f5f3ef"; th:text="${session.customerIndent.getCustomerPhone()}">此处显示电话号码</p>
										<input type="hidden" name="tel" id="tel" th:value="${session.customerIndent.getCustomerPhone()}" placeholder="输入手机号" datatype='m' errormsg='手机号格式错误' nullmsg="请输入手机号！" sucmsg='通过验证' class="iphone-inp" />
									</div>
								<!--	<div class="clear"></div>-->
								</div>
								<div class="w-row-button">
									<button class="button">保存按钮</button>
									<button type="button" class="button1">取消</button>
								</div>
							</div>

						</div>
						<div class="bd-table-right fl">
							<!--<div class="w-row">-->
								<!--<div class="w-row-input">-->
									<!--<input type="checkbox" name="" value="" class="save-crea" />-->
									<!--<span>设为默认</span>-->
								<!--</div>-->
								<!---->
							<!--</div>-->
						</div>
						<div class="clear"></div>
					</div>
				</div>
			</div>
			<div class="w-panelfoot">
				<div class="information">
					<div class="Commodity-information">
						<div class="w-w2 fl">
							<span class="all fl">商品信息</span>
							<div class="clear"></div>
						</div>
						<div class="w-w3 fl">
							<span class="all">单价</span>
						</div>
						<div class="w-w4 fl">
							<span class="all">数量</span>
						</div>
						<div class="w-w6 fr">
							<span class="all fl">商品邮费</span>
								<div class="clear"></div>
							</div>
							<div class="w-w5 fr">
								<span class="all fr">小计</span>
							<div class="clear"></div>
						</div>
						<div class="clear"></div>
					</div>
				</div>
				<ul class="cart-grouplist">
					<li id="cartLi">
						<div class="list-list"  th:each="historyIndent:${session.historyIndents}">
							<div class="photo fl">
								<img th:src="@{${historyIndent.getProduct().getImgSrc()}}"/>
							</div>
							<input th:id="${historyIndent.getProduct().getProductId()}" type="hidden" th:value="${historyIndent.getProduct().getProductYoufei()}"/>
							<div class="nameCon fl">
								<p title="高清投影仪" class="sleep-yi" href="#" th:text="${historyIndent.getProduct().getProductName()}">高清投影仪</p>
								<div class="color">
									<a title="便携带  白色" href="#">便携带  白色</a>
								</div>
							</div>
							<span class="pricea fl">￥</span>
							<span class="priceb fl" th:text="${historyIndent.getProductPrice()}">799.00</span>
							<div class="u-selnum fl">
								<span class="reduction fl" th:text="${historyIndent.getProductCount()}">1</span>
								<div class="clear"></div>
							</div>
							<span class="price11 fl">￥</span>
							<span class="price1 fl" th:text="${historyIndent.getProductPrice()}*${historyIndent.getProductCount()}">799.00</span>
							<div class="move-del fl">
								<span class="pricec fl">￥</span>
								<span class="priced fl" th:text="${historyIndent.getProduct().getProductYoufei()}">7999.00</span>
								<div class="clear"></div>
							</div>
							<div class="clear"></div>
						</div>
					</li>
				</ul>
				<div class="m-invoice">
					<div class="invoice">
						<span>发票信息 ：</span>
						<img class="invoice-photo" th:src="@{/img/pic-39_02.png}" />
					</div>
					<div class="invoice-input">
						<input type="checkbox" name=""  value="" />
						<span>我要开发票</span>
					</div>
					<div class="m-invoice-bottomline">
						
					</div>
				</div>
				<div class="m-itemInfort">
					<div class="left-itemInfort fl">
						<div class="user">
							<span>使用优惠券(1张)</span>
							<img th:src="@{/img/pic-39_02.png}" />
						</div>
						<div class="button-bd">
							<p>暂无可用</p>
						</div>
						<div class="exchange">
							<span>兑换优惠券</span>
						</div>
						<form1>
							<div class="activeIptWrap-list">
								<input type="text" class="activeIpt" placeholder="请输入优惠码" >
								<button type="submit" class="activeBtn">兑换</button>
							</div>
						</form1>
						<!--<div class="splitLine">
							
						</div>-->
						<div class="user-ka">
							<span>使用礼品卡</span>
							<img th:src="@{/img/pic-39_02.png}" />
						</div>
						<div class="invoice-input">
							<input type="checkbox" name=""  value="" />
							<span>可用余额￥0.00</span>
						</div>
						<div class="exchangea">
							<span>添加礼品卡</span>
						</div>
						<form2>
							<div class="activeIptWrapa">
								<input type="text" class="activeIpt" placeholder="请输入礼品卡密码" id="">
								<button type="submit" class="activeBtn">绑定</button>
							</div>
						</form2>
					</div>
					<div class="right-itemInfort fr">
						<div class="goods-together">
							<span class="goods-together-name">商品合计    ：</span>
							<span class="goods-together-name-n">￥</span>
							<span class="goods-together-name-price" th:text="${session.indent.getIndentPrice()}">1198.00</span>
						
						</div>
						<div class="goods-freight">
							<span class="goods-freight-fre">运费    ：</span>
							<span class="goods-freight-m">￥</span>
							<span class="goods-freight-pic" id="postPrice">0.00</span>
						</div>
						<form action="/indent/shopping-pay" method="post" onsubmit="return check()">
							<input type="hidden" name="IndentPrice" id="indentPrice"/>
							<div class="lin-4">
								<span class="money">应付总额    ：</span>
								<span class="xing">￥</span>
								<span class="money-mon" th:text="${session.indent.getIndentPrice()}" id="totalPrice">1198.00</span>
							</div>
							<div class="foo">
								<div class="foo-title fr">
									<p><button type="submit" class="xixi">去付款</button></p>
								</div>
								<!--/indent/shopping-pay-->

<!--								<a id="goToPay" href="#"><span>去付款</span></a>-->
							</div>
						</form>

						<div class="clear"></div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
		<div id="footer"></div>
		<div th:replace="footer::#footbar"></div>
	<script th:src="@{/js/jquery-3.3.1.min.js}" src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{/administration/adminlte/bower_components/bootstrap/dist/js/bootstrap.js}" src="/static/administration/adminlte/bower_components/bootstrap/dist/js/bootstrap.js"></script>
		<script th:src="@{/js/mock.js}" src="js/mock.js" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{/js/mock-json.js}" src="js/mock-json.js" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{/js/Validform_v5.3.2_min.js}" src="js/Validform_v5.3.2_min.js" type="text/javascript" charset="utf-8"></script>
		<script th:src="@{/layer-v3.1.1/layer/layer.js}" src="layer-v3.1.1/layer/layer.js"></script>
		<script th:src="@{/js/PCASClass.js}" src="js/PCASClass.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">

		function check(){
			if($("select").val() == 0){
				layer.msg("请先选择地址");
				return false;
			}else {
				$('select').attr("disabled","true")
				var addressId;
				var indentId = $("#indentId").val();
				$(".xiala").each(
						function () {
							if($(this).prop("selected")){
								addressId=$(this).val();
							}
						}
				)
				$.ajax({
					url: '/indent/save_address',
					data: {
						addressId: addressId,
						indentId: indentId
					},
					method: 'GET',
					traditional: true,
					success: function (json) {
						layer.close(index); //如果设定了yes回调，需进行手工关闭
					}
				});
				return true;
			}
		}


		window.onload=function (){
			var postPrice=0.0;
			$("#cartLi").children().each(function () {
				// alert($(this).find('input').val());
				postPrice+=parseFloat($(this).find('input').val());
			})
			$("#postPrice").text(postPrice);
			var totalPrice0 = parseFloat($("#totalPrice").text());
			var totalPrice1 = totalPrice0 + postPrice;
			$("#totalPrice").text(totalPrice1);
			$('#indentPrice').val(totalPrice1);
			// $("#totalPrice").val(totalPrice1);
			// if($('#llll').val()==1){
			//
			// 	window.location.replace("http://www.baidu.com");
			// }
		}

	</script>
		
		<script language="javascript" defer>

		</script>
		<script type="text/javascript">
			$("form").Validform({
				tiptype: 3,
				datatype: {
					'm': /^13[0-9]{9}$|14[0-9]{9}|15[0-9]{9}$|18[0-9]|17[0-9]{9}$/,
					'password': /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,16}$/
				}
			});
		</script>
		<!--<script type="text/javascript">
			$(".w-row-button .button").click(function(){
				//表单序列化
				var data = $('form').serialize();
				$.post('/register', data, function(result){
					if(result.status){
						alert(result.msg);
						//跳转页面
						location.href="shopping-cars.html";
					}else{
						console.log(result);
					}					
				}, 'json');
			})
		</script>
-->		<script type="text/javascript">
			$(".w-row-button .button").click(function() {
				$('select').css("borderColor","#f5f3ef")
				if($("select").val() == 0){
					// alert("请先选择地址")
					layer.msg("请先选择地址");
					return;
				}else{
					$('select').attr("disabled","true")
					var addressId;
					var indentId = $("#indentId").val();
					$(".xiala").each(
							function () {
								if($(this).prop("selected")){
									addressId=$(this).val();
								}
							}
					)

					layer.open({
						content: '保存成功，嘤嘤嘤！',
						yes: function(index, layero) {
							$.ajax({
								url: '/indent/save_address',
								data: {
									addressId: addressId,
									indentId: indentId
								},
								method: 'GET',
								traditional: true,
								success: function (json) {
									layer.close(index); //如果设定了yes回调，需进行手工关闭
								}
							});
						}
					});
				}


			});
			$(".activeIptWrap .activeBtn").click(function() {
				layer.open({
					content: '优惠券不够了，明天再来吧！',
					yes: function(index, layero) {
						layer.close(index); //如果设定了yes回调，需进行手工关闭
					}
				});
			})
		</script>
		<script type="text/javascript">
			$(".activeIptWrap-list").css("display", "none");
			var flag = true;
			$(".exchange span").click(function() {
				if(flag) {
					$(this).parent().siblings().find(".activeIptWrap-list").css({
						display: 'block'
					});
					flag = false;
				} else {
					$(this).parent().siblings().find(".activeIptWrap-list").css({
						display: 'none'
					});
					flag = true;
				}
			});
		</script>
		<script type="text/javascript">
			$(".activeIptWrapa").css("display", "none");
			var flag = true;
			$(".exchangea span").click(function() {
				if(flag) {
					$(this).parent().siblings().find(".activeIptWrapa").css({
						display: 'block'
					});
					flag = false;
				} else {
					$(this).parent().siblings().find(".activeIptWrapa").css({
						display: 'none'
					});
					flag = true;
				}
			});
		</script>
	</body>

</html>